body { font-family: verdana;}

body p {
    font-size: 18px;
}

body ul>li {
    font-size: 18px;
}

body ol>li {
    font-size: 18px !important;
}

body .small-prag {
    font-size: 15px;
}

.navbar {
    margin-bottom: 0px !important;
    border: none !important;
}

.navbar-default {
    background-color: #ffffff;
    border-color: #e7e7e700;
}

#main .logo {
    height: 120px;
    margin: 20px 0 15px 0 !important;
    display: inline-block;
}

#main .right-side {
    margin: 10% auto 0;
    display: inline-block;
    float: right;
}

#main .stylish-input-group .input-group-addon{ background: #0d0f5f !important;}

#main .stylish-input-group .form-control{
    border-right:0; 
    box-shadow:0 0 0; 
    border-color:#ccc;
    height: 50px;
}

#main .stylish-input-group button{
    border:0;
    background:transparent;
}

#main .fa-search { color: #ffffff;}

/*========= start border ribbon =========*/

#menu { background: #0d0f5f; position: relative; }

#menu:before, #menu:after, .outer:before, .outer:after {
    content: "";
    position: absolute;
    background: #999999;
    bottom: 18px;
    z-index: -1;
    height: 50px;
    width: 125px;
}

#menu:before, .outer:before { left: -175px;}
#menu:after, .outer:after { right: -175px;}

.main-menu:before, .main-menu:after, .inner:before, .inner:after {
    content: "";
    position: absolute;
    width: 50px;
    height: 50px;
    background: #06082e;
    bottom: 9px;
}

.main-menu:before, .inner:before {
    left: -50px;
    transform: rotateY(0.57deg) skewY(20deg);
}

.main-menu:after, .inner:after {
    right: -50px;
    transform: rotateY(0.57deg) skewY(-20deg);
}

.outer {
    background: #0d0f5f;
    position: relative;
    height: 50px;
    z-index: -1;
}

.head-out { position: relative; }

.head-out:before, .head-out:after {
    content: "";
    position: absolute;
    background: #f7f7f6;
    bottom: 18px;
    z-index: -1;
    height: 400px;
    width: 125px;
}

.head-out:before { left: -175px;}
.head-out:after { right: -175px;}

.head-in:before, .head-in:after {
    content: "";
    position: absolute;
    width: 50px;
    height: 400px;
    background: #f7f7f6;
    bottom: 0.6em;
}

.head-in:before {
    left: -50px;
    transform: rotateY(0.57deg) skewY(20deg);
}

.head-in:after {
    right: -50px;
    transform: rotateY(0.57deg) skewY(-20deg);
}


ul.nav.navbar-nav li a{
    color: #ffffff;
    font-weight: bold;
}

ul.nav.navbar-nav li.dropdown ul.dropdown-menu li a{
    color: #ffffff;
}


/*========= end border ribbon =========*/
#menu { background: #0d0f5f; }

.main-menu {
    list-style:none;
    margin:0;
    padding:0;
    text-align:center;
}
.main-menu li{
    display:inline;
}

.main-menu li+li:before {
    content: "|";
    color: #ffffff;
}

.main-menu a {
    display:inline-block;
    padding:12px 30px;
    color: #ffffff;
    font-weight: bold;
}

.main-menu a:hover, .main-menu a:active {
    text-decoration: none;
    color: #ffffff;
}

.main-menu ul.dropdown-menu {
    background-color: #0d0f5f;
    margin-top: 10px;
}

.main-menu ul.dropdown-menu li a {
    color: #ffffff;
    padding: 12px;
}

.main-menu ul.dropdown-menu li a:hover { color: #0d0f5f; }

.main-menu ul.dropdown-menu li+li:before { content: ""; }

.carousel-indicators .active { background-color: #c0000b !important; }
.carousel-indicators li { border: 1px solid #c0000b !important; }

header img {
    width: 100%;
    height: auto;
}

header .site-heading h1,.subheading {
    margin-top: 130px;
    float: right;
}

.title, .title a, .title a:hover {
    font-weight: bold;
    color: #080338;
    text-decoration: none;
}

#sect0 {
    margin: -25px auto 25px;
    text-align: left;
    border-bottom: 6px solid #080338;
    background-color: #ffffff;
    z-index: 1;
}

#sect0 h3 { text-indent: 15px;}

#sect0 .v-slider-frame {
  height: 50px;
  width: 100%;
  overflow: hidden;
  text-align: left;
}
#sect0 ul.v-slides {
  list-style-type: none;
  transform: translateY(50px);
  padding:0;
}
#sect0 .v-slide {
  font-size: 18px;
  line-height: 50px;
}

#sect0 .v-slide a { color: black; }
#sect0 .v-slide a:hover {
    text-decoration: none;
    font-size: 20px;
    color: #c0000b;
}

#sect1 {
    background-color: #f3f2ef;
    /*padding: 25px;*/
    padding: 25px 100px 0px 25px;
}

#sect1 .col-sm-4 {
    display: inline-block;
    float: right;

}

#sect1 .incident {
    text-align: center;
    position: relative;
    width: 350px;
    border: 8px solid #c0000b;
    border-radius: 15px;
    padding: 5px 8px;
    box-shadow: 2px 2px 4px #888;
    background-color: #ffffff;
}

#sect1 .incident:before, #sect1 .incident:after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    top: 285px;
}

@media screen and (min-width: 800px) {
#sect1 .incident:before {
    left: 145px;
    border: 25px solid;
    border-color: #c0000b transparent transparent transparent;
}

#sect1 .incident:after {
    left: 155px;
    border: 15px solid;
    border-color: #ffffff transparent transparent transparent;
}
}
#sect1 .vision {
    background-color: #cccccc;
    padding: 10px 35px 25px;
    margin: -25px -55px;
    width: 99.9%;
}

#sect1 .mission {
    background-color: #e5e5e5;
    padding: 10px 35px 25px;
    margin: 25px -55px;
    width: 99.9%;
}

#sect2 {
    background-color: #ffffff;
    text-align: center;
    padding: 25px 25px 35px 25px;
}

#sect2 h1 {
    border-bottom: 2px solid #080338;
    padding-bottom: 8px;
}

#sect2 p {
    text-align: justify;
    width: 95%;
    padding: 10px;
}

#sect2 img {
    width: 100%;
    height: auto;
    margin: 95px auto 25px;

}

#sect3 {
    background: #ffffff;
    padding: 25px;
}

#sect3 .border-desc {
    width: 300px;
    margin: 0 auto;
}

#sect3 .border-desc p { margin: 0 auto; }

#sect3 .border-desc img {
    display: block;
    margin: 0 auto;
    border-top: 6px solid #c0000b;
}

#sect3 .carousel-control.media {
    background: none repeat scroll 0 0 #840010;
    border: 4px solid #ffffff;
    height: 40px;
    width: 40px;
    color: #ffffff;
    margin: 15% 0%;
}

#sect4 { 
    background: linear-gradient(#cccccc, #ffffff, #ffffff);
    padding: 25px;
    margin-bottom: 25px;
}

#sect4 .border-img {
    margin: 0 auto;
    width: 300px;
    min-height: 280px;
    border-bottom: 5px solid #c0000b;
}

#sect4 img {
    width: 300px;
    height: auto;
    margin: 0 auto;
}

.#sect4 p { text-align: left; }

#sect4 .col-sm-4.col-xs-12 {
    margin: 0 auto;
}

.sect-content { background: #ffffff; }

#sect-content .main-title {
    padding-bottom: 25px;
    font-weight: bold;
}

#sect-content .main-link {
    position: relative;
    background-color: #999999;
    box-shadow: -3px 0 8px -2px #333;
    padding: 15px 50px 15px 25px;
    color: #0d0f5f;
    display: inline-block;
    margin-bottom: 30px;
    margin-left: -25px;
}

#sect-content .main-link:before, #sect-content .main-link:after {
    content: "";
    position: absolute;
    display: block;
    border-style: solid;
    right: -25px;
}

#sect-content .main-link:before {
    border-width: 32px 25px 0 0;
    border-color: #999999 transparent transparent transparent;
    top: 0;
}

#sect-content .main-link:after {
    border-width: 32px 0 0 25px;
    border-color: transparent transparent transparent #999999;
    bottom: 0;
}

#sect-content .footer-link {
    position: relative;
    background-color: #0d0f5f;
    box-shadow: 15px 0px 25px #06082e inset;
    padding: 15px 50px 15px 25px;
    color: #ffffff;
    display: inline-block;
    margin-bottom: 30px;
    margin-left: -25px;
}

#sect-content .footer-link:before, #sect-content .footer-link:after {
    content: "";
    position: absolute;
    display: block;
    border-style: solid;
    right: -25px;
}

#sect-content .footer-link:before {
    border-width: 32px 25px 0 0;
    border-color: #0d0f5f transparent transparent transparent;
    top: 0;
}

#sect-content .footer-link:after {
    border-width: 32px 0 0 25px;
    border-color: transparent transparent transparent #0d0f5f;
    bottom: 0;
}

#sect-content .title li a {
    text-decoration: none;
    color: black;
    padding-top: 6px;
}

#sect-content .row {
    width: 70%;
    padding: 25px 25px 60px;
}


#sect-content p { text-align: justify; }

#sect-content form label {
    text-align: left;
}

#sect-content form textarea {
    resize: none;
    height: 150px;
    overflow-x: hidden;
}

#sect-content .map-responsive iframe {
    border-top: 6px solid #C2000B !important;
    margin: 25px auto;
}

#sect-content #accordion #pekeliling .panel {
    margin: 8px !important;
}

#sect-content .col-sm-8 input[type=file] {
    padding-top: 7px;
}

#sect-content .col-sm-6 #datetime {
    padding-top: 7px;
}

#sect-content .dropdown .dropdown-menu a {
    font-size: 18px;
    color: #333333;
    padding: 8px 12px;
    display: block;
    text-decoration: none;
}

#sect-content .dropdown .dropdown-menu a:hover { color: white; font-weight: bold;}
#sect-content .dropdown .dropdown-menu .dropdown-item:hover { background-color: #080338;}

#sect-content .advisory-title h5 {
    background-color: #c0000b;
    border-top-left-radius: 1em;
    border-top-right-radius: 1em;
    height: 45px;
    padding-top: 15px;
    padding-left: 20px;
    font-size: 18px;
    color: #ffffff;
    margin-bottom: 0;
}

#sect-content .advisory-content {
    border: 1px solid #e5e5e5;
    padding: 25px;
}

#sect-content .advisory-content .sub-title {
    font-weight: bold;
    font-size: 17px;
}

#sect-content .advisory-content .sub-content {
    margin-left: 15px;
    margin-right: 15px;
}

#sect-content .advisory-content img {
    margin: 15px;
    padding-left: 15%;
    width: 550px;
    height: auto;
}

#sect-content .advisory-content figcaption {
    text-align: center !important;
}

#sect-content #dropdownMenuButton { font-size: 18px; }
#sect-content .form-horizontal { font-size: 18px; }
#sect-content .form-horizontal h3 { padding-bottom: 15px; }
#sect-content .form-horizontal label { font-weight: lighter; }

#sect-content .panel-title { font-size: 18px; }

.caret.rotate {
    transform: rotate(-90deg);
}
.sitemap p { line-height: 0.5; }
.sitemap-item li a { color: #1e295e;}
.sitemap-item li a:hover { color: #000000; text-decoration: none; text-shadow: 1px 1px 1px #1e295e;}
/*.sitemap-item li>ul>li:before {
    content: "- ";
}*/

.sect-subfooter {
    background-color: #534C4B;
    color: white;
    padding-top: 25px;
    padding-bottom: 20px;
    font-style: italic;
}

.sect-subfooter p { font-size: 18px; }

.sect-subfooter a, .sect-subfooter a:hover {
    font-size: 18px;
    color: #ffffff;
}

.sect-subfooter img {
    width: 40px;
    height: auto;
}

.sect-subfooter img.qrcode {
    width: 100px;
    height: auto;
    float: right;
    margin-right: 8%;
    margin-top: -25px;
}

.sect-subfooter table {
    font-size: 18px;
    width: 100%;
    text-align: left;
}

footer {
    font-size: 15px !important;
    background-color: #211C1D;
    color: white;
    padding-top: 25px;
    padding-bottom: 20px;
    bottom:0;
    font-style: italic;
}

footer p {
    float: left;
    display: inline-block;
}

footer span {
    font-size: 18px;
    float: right;
    display: inline-block;
}

footer a {
    color: white;
    padding-right: 5px;
}

footer a:hover { color: white;}




.imgnacsa1 {
		width:49%;	
		border-radius: 4px;
}

    /*======================================
       ---------- mobile view ----------
    ======================================*/

@media (max-width: 1025px) and (min-width: 350px) {

    #main .logo {
        height: 95px;
        margin: 20px 0 0px 0 !important;
    }

    #main .right-side { margin: 8px 0 15px 0; }

    #menu .navbar-toggle {
        float: none;
        display: block;
        margin: 8px auto;
        color: #ffffff;
    }

    #top-navbar ul>li>a:after {
        content: "" !important;
    }

    #menu:before, #menu:after, .navbar-nav:before, .navbar-nav:after { display: none; }

    .main-menu:before, .main-menu:after { display: none; }

    .container.outer, .container.outer:before, .container.outer:after, .row.inner:before, .row.inner:after { display: none; }

    .container.head-out:before, .container.head-out:after, .row.head-in:before, .row.head-in:after { display: none; }

    #sect0 { margin: 25px auto 25px; }

    #sect0 .v-slide {
      font-size: 15px;
    }

    #sect1 { padding: 0; }

    #sect1 .incident {
        width: auto;
        margin: 25px auto 5px;
    }

    #sect1 .incident:before { left: 135px; }
    #sect1 .incident:after { left: 145px; }

    #sect1 .vision, #sect1 .mission {
        margin: 25px auto;
        border-radius: 15px;
    }

    #sect2 { padding: 0 15px 25px; }
    #sect2 p { width: 100%; }
    #sect2 img { margin: 0; }

    #sect3 .border-desc {
        margin: 0 auto 25px;
        text-align: center;
    }

    #sect3 .carousel-control.media { display: none; }

    #sect4 img { width: 300px; }

    #sect4 .border-img {
        margin: 0 auto 25px;
        width: auto;
        min-height: auto;
    }

    #sect-content { padding: 25px; }

    #sect-content .row { width: 110%; }

    #sect-content p { text-align: left; }

    #sect-content .main-link:before, #sect-content .main-link:after, #sect-content .footer-link:before, #sect-content .footer-link:after { display: none; }

    #sect-content .map-responsive iframe { width: 100%;}

    .sect-subfooter .col-sm-4 {
        padding: 15px 15px 0;
    }

    .sect-subfooter p, .sect-subfooter a, .sect-subfooter a:hover { font-size: 12px; }

    .sect-subfooter td {
        font-size: 12px;
        width: 50px;
    }

    .sect-subfooter img.qrcode {
        width: 70px;
        margin-right: 15px;
    }

    footer p {
        font-size: 13px;
        float: none;
        display: inherit;
        text-align: center;
    }

    footer span {
        font-size: 13px;
        text-align: center;
    }
	
	.imgnacsa1 {
		float: none;
		width:100%;	
		margin-top: 5px;
		border-radius: 4px;
	}	
	.imgnacsa12 {
		float: none;
		width:100%;	
		margin-top: 5px;
		border-radius: 4px;
	}
}